<template>
	<view>
    <commonWins> </commonWins>
		<view class="match tac fz12" v-if="!id">恭喜您已智能为您匹配以下方案</view>
		<view class="wrapper disc jsa aic" v-if="!data">
			<view class="schedule disc jsa aic">
				<view class="schedule-nav disc jsa aic">
					<text class="schedule-number fw">评估中...</text>
				</view>
			</view>
			<view class="fz12 tac">评估中，请等待!</view>
		</view>
		<view class="goodsDetail" v-else>


      <view v-if="show">
        <u-loadmore status="loading" />
      </view>

      <view v-if="Object.keys(product.productList).length === 0">
        <u-empty text="暂无资产流动性方案，请先完善资料！" mode="list"></u-empty>
      </view>



			<view :class="item.select?'goodsList sureIt':'goodsList'"  v-for="item in product.productList" :key="item.id"
				@click="selectFunc(item)">
				<view class="top disb aic">
					<view class="disp aic">
						<image class="image" :src="item.productImg" mode=""></image>
						<view class="fw">{{item.productName}}</view>
					</view>
					<view class="color">￥{{item.ygMaxAmount}}</view>
				</view>
				<view class="bot disp">
					<view class="color6 fl1 w-style">
						<text class="color-bw">{{annualInterestLabel}}：</text>
            <br>
						<text>{{item.annualInterest}}</text>
					</view>
					<view class="color6 fl1 w-style">
            <text class="color-bw">{{loanPeriodLabel}}：</text>
            <br>
						<text>{{item.loanTime}}</text>
					</view>
				</view>

        <view class="bot disp"  style="width: 100%;">
          <view class="color6 fl1 w-style">
            <text  class="color-bw">产品标签：</text>
            <br>
            <text>{{item.productLable}}</text>
          </view>
          <view class="color6 fl1 w-style">
            <text  class="color-bw">产品介绍：</text>
            <br>
            <text>{{item.productIntroduce}}</text>
          </view>
        </view>

			</view>
			<view class="color3 matp tac" v-if="ygMaxAmount">您的资产流动性测算：</view>
			<view class="color matp fw tac" v-if="ygMaxAmount">
				<text>￥</text>
				<text class="fz20">{{ygMaxAmount}}</text>
			</view>
<!--      <view class="color matp fw tac" v-else>-->
<!--        <text>￥</text>-->
<!--        <text class="fz20">0.0</text>-->
<!--      </view>-->
			<view class="tac colorf Btn matp" @click="toSelect" v-if="ygMaxAmount">提交</view>
			<view class="tac colorf Btn matp" @click="goziliao" v-if="Object.keys(product.productList).length === 0">去完善资料</view>
			<view class="callBtn matp disc jsa aic" @click="toInfoUp()" v-if="ygMaxAmount">
				<view class="disp aic" >
<!--					<image src="../../static/images/test/phone.png" mode=""></image>-->
					<text>重新填写资料</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mustTest,
		intelligenceTest
	} from '../../api/category';
  import commonWins from "./commonWins.vue";
	export default {
    components: {commonWins},
		data() {
			return {
				id: null,
				type: null,
        tableId:0,
        show:true,
				data: 1,
        productType:'',
        productTypeName:'',
				select: '',
        ygMaxAmount:'',
				productId: null,
				product: {},
				annualInterestLabel: '',
				loanPeriodLabel: ''
			};
		},
		onLoad(option) {
			this.id = option.id
			this.type = option.type
      this.tableId = option.tableId
      //手动测额度时默认传过来的产品 id
      this.productId = option.id
      console.log(option)
			this.getWordings()
		},
		onShow() {
			this.getShop()
      setTimeout(() => {
        this.show = false
      },700)
		},
		methods: {
			// 获取缓存的文案配置
			getWordings() {
				const annualInterest = uni.getStorageSync('annual_interest')
				if (annualInterest) {
					this.annualInterestLabel = annualInterest
				}
				
				const loanPeriod = uni.getStorageSync('loan_period')
				if (loanPeriod) {
					this.loanPeriodLabel = loanPeriod
				}
			},
			//选择
			// selectFunc(item){
			// 	item.select = !item.select
			// 	this.product.amount = 0
			// 	this.product.productList.forEach(v => {
			// 		if(v.select==true){
			// 			this.product.amount += parseInt(v.maxAmount)
			// 		}
			// 	})
			// },
			selectFunc(item) {
				this.product.productList.forEach(v => {
					v.select = false; // 所有商品都被取消选中  
				});
				item.select = true
				//this.product.amount = item.select ? parseInt(item.maxAmount) : 0;
        //this.product.ygMaxAmount = item.select ? item.ygMaxAmount : 0
        this.ygMaxAmount = item.select ? item.ygMaxAmount : 0
        this.productType = item.productType
        this.productTypeName = item.productTypeName
        this.productId = item.id
			},
			//去申请
			toSelect() {
				let arr = []
				this.product.productList.forEach(v => {
					if (v.select) {
						arr.push(v.id)
					}
				})
				this.select = arr.toString();
				if (this.select) {
					uni.navigateTo({
						url: `/pages/category/selectSalesman?id=${this.select}&type=${this.type}&amount=${this.ygMaxAmount}&tableId=`+this.tableId
					})
				} else {
					uni.$u.toast('请选择一款上述的咨询')
				}
			},
      toInfoUp(){
        const sel = this.productType
        uni.navigateTo({
          //:`/pagesA/list/carInformation?id=${this.productType}`+"&pid="+this.productId
          url:`/pagesA/list/carInformation?id=${this.productType}`+"&ui=&flag=true"+'&productTypeName='+this.productTypeName
        })
        // if(sel==7){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // } else if(sel==1){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // } else if(sel==8){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // } else if(sel==9){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // }else if(sel==10){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // }
        // else if(sel==14){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // }
        // else if(sel==15){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // }else if(sel==16){
        //   uni.navigateTo({
        //     url:`/pages/setting/assetList?id=${this.productType}`
        //   })
        // } else{
        //   uni.navigateTo({
        //     url:`/pagesA/list/carInformation?id=${this.productType}`
        //   })
        // }
      },
			//获取产品
			getShop() {
				if (this.type == 0) {
					mustTest({
						productId: this.id
					}).then(res => {
						res.data.productList.forEach((v,index) => {
              if (index==0){
                v.select = true
                this.ygMaxAmount = v.ygMaxAmount
                this.productType = v.productType
                this.productTypeName = v.productTypeName
              }else {
                v.select = false
              }
						})
						this.product = res.data
					})
				} else {
					intelligenceTest().then(res => {
						res.data.productList.forEach((v,index) => {
              if (index==0){
                v.select = true
                this.ygMaxAmount = v.ygMaxAmount
                this.productType = v.productType
                this.productTypeName = v.productTypeName
                this.productId = v.id
              }else {
                v.select = false
              }
						})
						this.product = res.data
					})
				}
			},
			//去完善资料
			goziliao() {
				uni.navigateTo({
					url: "/pages/setting/assetType"
				})
			}
		}
	}
</script>

<style lang="scss">
	.wrapper {
		height: 600rpx;
		padding-top: 100rpx;
	}

	.match {
		padding: 20rpx 0;
	}

	.schedule {
		width: 350rpx;
		height: 350rpx;
		border-radius: 50%;
		background-color: #deeaff;
		border: 1px solid #8ca7ff;

		.schedule-nav {
			height: 160rpx;

			.schedule-number {
				font-size: 20px;
				color: blue;
			}
		}
	}

	.goodsDetail {
		padding: 20rpx;

		.goodsList {
			padding: 0 20rpx;
			background-color: #fff;
			border: 1px solid #c8c8c8;
			border-radius: 10rpx;
			margin: 20rpx 0;
			box-shadow: 0rpx 0rpx 20rpx #ccc;

			.top {
				padding: 20rpx 0;
				border-bottom: 1rpx solid #ccc;

				.image {
					width: 80rpx;
					height: 80rpx;
					border-radius: 10rpx;
					margin-right: 20rpx;
				}
			}

			.bot {
				padding: 20rpx 0;
			}
		}

		.sureIt {
      border: 2px solid #647bf9;
		}

		.Btn {
			line-height: 80rpx;
			border-radius: 40rpx;
			background-color: #0055ff;
		}

		.callBtn {
			line-height: 80rpx;
			border-radius: 40rpx;
			color: #0055ff;
			border: 1rpx solid #0055ff;

			image {
				width: 30rpx;
				height: 30rpx;
				margin-right: 10rpx;
			}
		}
	}
  .color-bw{
    color: #0d0c0c;
    font-weight: bolder;
  }
  .w-style{
    width: 49%;
  }
	.matp {
		margin-top: 40rpx;
	}
</style>